<!DOCTYPE html >
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">      <!--声明Thymeleaf命名空间-->
<head>
    <title>菜单配置</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link rel="stylesheet" href="/css/bootstrap.min.css"></link>
</head>
<body>

<nav class="navbar navbar-default">
    <div class="container-fluid">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <a class="navbar-brand" href="/index.html">系统后台管理</a>
        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav ">
                <li><a href="/admin/role.html">角色管理</a></li>
                <li><a href="/admin/menu.html">菜单管理</a></li>
                <li><a href="/admin/apis.html">API管理</a></li>
                <li><a href="/admin/cache.html">缓存管理</a></li>
            </ul>

        </div><!-- /.navbar-collapse -->

    </div><!-- /.container-fluid -->
</nav>
<div class="container-fluid">

    <ol class="breadcrumb">
        <li><a href="#">首页</a></li>
    </ol>
    <div class="panel panel-default">
        <div class="panel-body">

            <div id="loginDiv" style="width: 400px;">
                <h1> 登陆后才能访问 </h1>


                <form class="form-horizontal" id="loginForm" onkeydown="if(event.keyCode==13)return false;" >
                    <div class="form-group">
                        <label for="username" class="col-sm-2 control-label">账号</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" name="username" id="username" placeholder="账号"
                                   required>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="password" class="col-sm-2 control-label">密码</label>
                        <div class="col-sm-10">
                            <input type="password" class="form-control" name="password" id="password" placeholder="密码"
                                   required>
                        </div>
                    </div>
                    <button type="button" id="loginBtn" class="btn btn-primary">登陆</button>
                </form>
            </div>
            <div id="loginEndDiv" style="display: none">

            </div>
        </div>
    </div>
</div>
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="/js/jquery.min.js"></script>
<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
<script src="/js/bootstrap.min.js"></script>
<script src="/js/bootstrapValidator.js"></script>

<script src="/js/auth.js"></script>
<script>
    document.addEventListener("keyup",function(e){
        if(e.keyCode=='13'){
            $("#loginBtn").click();
        }
        //console.log(e.keyCode+" is up");

    });
    $.ajax({
        type: 'GET',
        url: '/v1/auths/getUser',
        dataType: 'json',
        success: function (data) {
            if (data != null && data.data != null && data.code == 200) {
                $("#loginEndDiv").show();
                var roles="";
                if(data.data.roles&&data.data.roles.length>0){
                    for(var i=0;i<data.data.roles.length;i++){
                        roles+=data.data.roles[i].name+data.data.roles[i].code+"，";
                    }
                    roles= roles.substring(0,roles.length-1);
                }else{
                    roles="普通用户";
                }

                var html="欢迎您," + data.data.userName+"。您的角色是"+roles;
                if(!roles.indexOf('ROLE_ADMIN')>-1){
                    html+="，本后台需要超级管理员ROLE_ADMIN访问权限。<button type='button' onclick='logout()' class='btn btn-primary'>退出</button>";
                }else{
                    html+="。您有权限访问其他功能，请进行其他操作。<button type='button' onclick='logout()' class='btn btn-primary'>退出</button>";
                }

                $("#loginEndDiv").html(html);
                $("#loginDiv").hide();
            }
        }

    });
   function logout() {
        $.ajax({
            type: 'GET',
            url: '/v1/auths/logout',
            dataType: 'json',
            success: function (data) {
                sessionStorage.setItem("token", null);
                alert("退出成功" );
                location.reload();
            },
            error: function (jqXHR, textStatus, errorThrown) {
                var json = JSON.parse(jqXHR.responseText);
                alert(json.message);
            }
        });
    }

    $('#loginForm').bootstrapValidator();
    $("#loginBtn").click(function () {
        var form = $("#loginForm");
        form.data("bootstrapValidator").validate(); // 手动验证
        var isValid = form.data("bootstrapValidator").isValid(); // 是否验证成功
        if (isValid) {

        } else {
            //  alert("请检查")
            return;
        }
        var data = {
            "username": $("#username").val(),
            "password": $("#password").val()
        };
        $.ajax({
            type: 'POST',
            url: '/v1/auths/login',
            dataType: 'json',
            contentType: "application/json",
            data: JSON.stringify(data),
            success: function (data) {
                if (data != null && data.data != null && data.code == 200) {
                    sessionStorage.setItem("token", data.data.token);
                    sessionStorage.setItem("tokenRefreshTime",(new Date()).valueOf());
                    alert("登陆成功" + data.data.userName);

                    location.reload();
                } else {
                    alert("登陆失败" + data.message);
                }
            },
            error: function (jqXHR, textStatus, errorThrown) {
                var json = JSON.parse(jqXHR.responseText);
                alert(json.message);
            }
        });
    });
</script>
</body>
</html>